<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="../css/zk_sign.css">
</head>

<body>
    <header>
        <div class="header_box">
            <div class="logo">
                <a href="zk_home.html"><img src="../img/zk_icon_10.png" alt=""></a>
                <p>中关村在线旗下导购平台</p>
            </div>
            <div class="register_bar">
                <a href="/html/zk_sign_in.html">立即注册</a>
                还没有值买账号？
            </div>
        </div>
    </header>
    <main>
        <form action="">
            <div class="man_left">
                <a href="zk_home.html">
                    <img src="../img/zk_guanggao_3.jpg" alt="">
                </a>
            </div>
            <div class="man_right">
                <ul class="taXian">
                    <li class="hover">登录值买</li>
                    <li>商家登录</li>
                </ul>
                <div class="man_sign">
                    <div class="input_box">
                        <input type="text" id="mailbox" placeholder="请输入邮箱号">
                    </div>
                    <div class="input_box">
                        <input type="password" id="password" placeholder="请输入密码">
                    </div>
                    <div class="wjmm">
                        <a href="">忘记密码？</a>
                    </div>
                    <button id="submission">登录</button>
                </div>
                <div class="man_sign" style="display: none;">
                    <div class="input_box">
                        <input type="text" id="mailbox" placeholder="请输入商家邮箱号">
                    </div>
                    <div class="input_box">
                        <input type="password" id="password" placeholder="请输入密码">
                    </div>
                    <div class="wjmm">
                        <a href="">忘记密码？</a>
                    </div>
                    <button id="submission">登录</button>
                </div>
            </div>
        </form>
    </main>
    <footer>
        <div class="footer_box">
            <div class="foot_left">
                <a href="http://www.rongroad.com">关于Z商城</a>|
                <a href="http://www.rongroad.com">联系我们</a>|
                <a href="http://www.rongroad.com">帮助中心</a>
            </div>
            <div class="foot_righ">
                ©2020. 中关村在线 版权所有
            </div>
        </div>
    </footer>
    <script>
        var li = document.querySelectorAll(".man_right>ul>li");
        var form = document.querySelectorAll("div.man_sign")
        var button = document.querySelectorAll("#submission")
        li.forEach(function (item, index) {
            item.index = index;
            item.onclick = function () {
                li.forEach(function (item) {
                    item.classList.remove("hover");
                })
                form.forEach(function (item) {
                    item.style.display = "none";
                })
                this.classList.add("hover");
                form[this.index].style.display = "block";
            }
        })
        button.forEach(function (item, index) {
            item.index = index;
            item.onclick = function (e) {
                e.preventDefault()
                var mailbox = this.parentNode.querySelector("#mailbox").value
                var password = this.parentNode.querySelector("#password").value
                if (this.index) {
                    post("/php/hom_ko.php",{mailbox:mailbox,password:password,effect:"sign",ip:"shangJia"},function(res){

                    })
                } else {
                    post("/php/hom_ko.php",{mailbox:mailbox,password:password,effect:"sign",ip:"yongHu"},function(res){
                        var data = JSON.parse(res) 
                        if(data.success){
                            document.querySelector("main").innerHTML="<div class='chenggong'>登录成功,即将跳转······</div>"
                            var time = new Date()
                            time.setDate(time.getDate() + 1)
                            document.cookie = `/user=${mailbox}/;expires=${time}`
                            setTimeout(function(){
                                history.go(-1)
                            },800)
                        }else{
                            alert(data.data)
                        }
                    })
                }
            }
        })
        function post(str,obj, fun) {
            var kopy = "";
            for (var item in obj) {
                kopy += `${item}=${obj[item]}&`
            }
            var xrt = new XMLHttpRequest();
            xrt.open("post",str);
            xrt.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            xrt.send(kopy)
            xrt.onreadystatechange = function () {
                if (xrt.readyState == 4) {
                    fun(xrt.responseText)
                }
            }
        }
    </script>
</body>

</html>